<!-- 律师列表-->
<template>
	<div>
		<van-nav-bar title="律师列表" left-text="" left-arrow @click-left="onClickLeft" @click-right="onClickRight" />
		<van-dropdown-menu>
			<van-dropdown-item :title="title" ref="item">
				<!-- <van-sidebar v-model="value">
					<van-sidebar-item :key="9999999" title="全国" value=""/>
					<van-sidebar-item v-for="(item,index) in columns" :key="index" :title="item.region_name" />
					
				</van-sidebar> -->
				<van-tree-select
				  :items="cityList"
				  :main-active-index="activeIndex"
				  :active-id="region"
				  @click-nav="onClickNav"
				  @click-item="onClickNav"
				/>
			</van-dropdown-item>
			<van-dropdown-item :title="title1" id="item1" >
				<van-tree-select
				  :items="option2"
				  :main-active-index="activeId"
				  :active-id="case_type_id"
				  @click-nav="onClickNav1"
				  @click-item="onClickNav1"
				/>
			</van-dropdown-item>
		</van-dropdown-menu>
		<div class="lawyer-content">
			<van-list v-model="loading" :finished="finished" :finished-text="lawerArr.length==0?'当前城市暂无合作律师':'没有更多了'" @load="onLoad">
				<dtlawer :lawerArr="lawerArr"></dtlawer>
			</van-list>
		</div>
	</div>
</template>
<script>
	import {
		Toast
	} from "vant";
	import dtlawer from './dtlawer.vue'
	export default {
		components:{
			dtlawer
		},
		data() {
			return {
				case_type_id: '',
				value: 0,
				title: '乌鲁木齐市',
				title1: '综合排序',
				region: 45,
				page: 1,
				loading: false,
				finished: false,
				lawerArr: [],
				wordArr: [],
				option: [],
				
				activeIndex: 5,
				activeId: 0,
			};
		},
		computed: {
			option2() {
				return this.option.reduce((arry, item) => {
					item.text = item.type_name;
					item.id = item.case_type_id;
					if(item.children&&item.children.length){
						item.children = item.children.reduce((ary1,item1)=>{
							item1.text = item1.type_name;
							item1.id = item1.case_type_id;
							ary1.push(item1);
							return ary1
						},[])
					}else{
						item.children = []
					}
					arry.push(item);
					return arry
				}, [{
						text: "综合排序",
						id: ""
					}]);
			},
			cityList(){
				return this.columns.reduce((arry, item) => {
					item.text = item.region_name;
					if(item.children&&item.children.length){
						item.children = item.children.reduce((ary1,item1)=>{
							item1.text = item1.region_name;
							ary1.push(item1);
							return ary1
						},[])
					}
					arry.push(item);
					return arry
				}, [{id: '',text: '全国',children:[]}]);
			},
			columns() {
				return this.$store.state.region
			},
			
		},
		mounted(){
			this.getLitiGation();
		},
		methods: {
			onClickLeft() {
				this.$router.go(-1);
			},
			routerToDetail() {
				this.$router.push({
					path: "/lawerDetail"
				});
			},
			onClickRight() {
				Toast("按钮");
			},
			onClickNav(event){
				if(typeof(event)=="object"){
					this.region = event.id;
					this.title = event.text;
				}else{
					this.activeIndex = event;
					this.region = this.cityList[event].id;
					this.title = this.cityList[event].text;
				}
				this.page = 1;
				this.loading = false;
				this.finished = false;
				this.lawerArr = [];
				this.onLoad();
			},
			onClickNav1(event){
				if(typeof(event)=="object"){
					this.case_type_id = event.id;
					this.title1 = event.text;
				}else{
					this.activeId = event;
					this.case_type_id = this.option2[event].id;
					this.title1 = this.option2[event].text;
				}
				this.page = 1;
				this.loading = false;
				this.finished = false;
				this.lawerArr = [];
				this.onLoad();
			},
			//诉讼页面(获取诉讼基础数据)
			async getLitiGation() {
				let [e, data] = await this.$store.dispatch('center/caseTypeApi', {
					pageSize:999
				});
				if (e) return;
				this.option = data;
			},
			//获取律师列表
			async onLoad() {
				//获取展位律师
				let [e, data] = await this.$store.dispatch('lawyer/lawyerListApi', {
					pageNo: this.page,
					pageSize: 10,
					type: this.case_type_id,
					regionId: this.region,
				});
				if (e) return;
				if (this.page == 1) {
					this.lawerArr = [];
				}
				this.lawerArr = this.lawerArr.concat(data.data)
				// 加载状态结束
				this.loading = false;
				
				// // 数据全部加载完成
				// console.log(data.total == this.articleList.length);
				if (data.total == this.lawerArr.length) {
					this.finished = true;
				} else {
					this.page++
				}
			}
		}
	};
</script>
<style lang="less" scoped>
	.van-sidebar-item {
		background-color: #fff;
		width: 125px;
		text-align: center;
	}

	.van-sidebar-item--select {
		border-color: #1a85ff;
		color: #1a85ff;
		width: 125px;
		text-align: center;
	}

	.lawyer-content {
		height: calc(100vh - 104px);
	}
</style>
